<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		
		<title>vue使用教程</title>
		<script type="text/javascript" src="vue.js"></script>
	</head>
	<body>
		<div id="app">{{messge}}
			<br>

			<img :src="imgNo_1" alt="百度一下">
			<br>
			  <a :href="linkN_1">{{a_txt}}

			</a>

		</div>
		
		
	</body>
	<script>
		//vue是一个类 使用的是Vue的实例
		const vm=new Vue({
			//vue使用的模版页
			//vue在工作时，先将el对应的模版加载到内存VNode(虚拟DOM)
			//在vue的生命周期中,负责解析虚拟DOM,最终渲染到页面
			el:"#app",
            /*data:function(){
				return{
					
				}
			} */
			//es6中对于方法的简化写法 和上面的es5的写法等价
			data(){
				return {
				//定义我们程序开发过程中需要声明的属性
					messge:"hello world",
					linkN_1:"https://baidu.com",
					a_txt:"百度一下 你就知道",
					imgNo_1:"https://t7.baidu.com/it/u=1699454570,2952675447&fm=85&app=131&size=f242,150&n=0&f=JPEG&fmt=auto?s=1BF6E816C8B47F800B7547C402007026&sec=1684342800&t=d19f34b3eb6bd585ccd921a1c3f272a8"
				}
			}
		})
		
	</script>
</html>